<template>
  <div class="breadMenu">
    <div class="width1200">
      <span class="title">您的当前位置：</span>
      <el-breadcrumb separator-class="el-icon-arrow-right">

        <el-breadcrumb-item :to="{ path: '/Home' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item v-for="(item,index) in breadList"
                            :key="index">{{ item }}</el-breadcrumb-item>

      </el-breadcrumb>
    </div>
  </div>
</template>

<script>
export default {
  name: 'breadMenu',
  props: ['list'],
  computed: {
    breadList() {
      return this.list || this.$route.meta
    },
  },
}
</script>

<style scoped lang="scss">
.breadMenu {
  width: calc(100% - 2px);
  height: 40px;
  background: #ffffff;
  border: 1px solid #eeeeee;
  .title {
    margin-top: -3px;
  }
  .width1200 {
    height: 100%;
    display: flex;
    align-items: center;
  }
}
</style>
